<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>借阅信息</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="">
  <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
  <meta name="generator" content="Hugo 0.88.1">
  <title>Dashboard Template · Bootstrap v5.1</title>

  <link rel="canonical" href="https://getbootstrap.com/docs/5.1/examples/dashboard/">


  <!--    <script src="/js/jquery-1.11.1.min.js"></script>-->
  <!--    <script type="text/javascript" src="/js/zxf_page.js"></script>-->
  <!--    <link rel="stylesheet" type="text/css" href="css/zxf_page.css"/>-->

  <!-- Bootstrap core CSS -->
  <link th:href="@{/assets/dist/css/bootstrap.min.css}" rel="stylesheet">

  <style>
    textarea{
      width: 250px;
      height: 140px;
      resize: none;
    }

    .bd-placeholder-img {
      font-size: 1.125rem;
      text-anchor: middle;
      -webkit-user-select: none;
      -moz-user-select: none;
      user-select: none;
    }

    @media (min-width: 768px) {
      .bd-placeholder-img-lg {
        font-size: 3.5rem;
      }
    }
    .a1{
      position: relative;
    }
    .a1 input{
      position: absolute;
      top: 400px;
      left: 10px;
    }
    .layui-table{
      text-align: center;
    }
    tr{
      border: 1px solid black;
    }
    td{
      border: 1px solid black;
    }
  </style>


  <!-- Custom styles for this template -->
  <link th:href="@{/css/dashboard.css}" rel="stylesheet">
  <!--    <link rel="stylesheet" href="/static/css/zxf_page.css">-->
  <!--    <script src="/static/js/jquery-1.11.1.min.js"></script>-->
  <!--    <script src="/static/js/zxf_page.js"></script>-->


</head>
<body>
<header th:replace="layout/layout::dh"></header>

<div class="container-fluid">
  <div class="row">
    <nav th:replace="layout/layout::nav"></nav>
    <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
      <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
        <h1 class="h2">借阅信息</h1>
        <div class="btn-toolbar mb-2 mb-md-0">
          <div class="btn-group me-2">
            <button type="button" class="btn btn-sm btn-outline-secondary">添加</button>
            <button type="button" class="btn btn-sm btn-outline-secondary">修改</button>
          </div>
          <input type="date">
        </div>
      </div>

      <div class="layui-body layui-container">

        <hr class="layui-bg-blue">
        <h2 style="text-align:center">所有借书记录</h2>
        <hr class="layui-bg-blue">


        <table class="layui-table" lay-size="sm" border="1" cellspacing="0" align="center" width="1000px" height="520px">

          <tr bgcolor=gray>
            <td>用户</td>
            <td>书籍</td>
            <td>借书日期</td>
            <td>还书日期</td>
            <td>借阅状态</td>
          </tr>
          <tr>
            <td>Third</td>
            <td>钢铁是怎么练成的</td>
            <td>2019.6.1</td>
            <td>2019.7.1</td>
            <td>已还</td>
          </tr>
          <tr>
            <td>Third</td>
            <td>陨落</td>
            <td>2020.5.1</td>
            <td>2019.6.1</td>
            <td>已还</td>
          </tr>
          <tr>
            <td>Third</td>
            <td>太阳的后裔</td>
            <td>2019.4.1</td>
            <td>2019.5.1</td>
            <td>已还</td>
          </tr>
<!--          <tr>-->
<!--            <td>Third</td>-->
<!--            <td>微机原理</td>-->
<!--            <td>2021.3.1</td>-->
<!--            <td>2021.4.1</td>-->
<!--            <td>已还</td>-->
<!--          </tr>-->
<!--          <tr>-->
<!--            <td>Third</td>-->
<!--            <td>数据结构</td>-->
<!--            <td>2021.6.1</td>-->
<!--            <td>2021.7.1</td>-->
<!--            <td>已还</td>-->
<!--          </tr>-->

          <!--                        <tr th:each="person:${pageInfo.list}">-->
          <!--                            <td th:text="${person.id}"></td>-->
          <!--                            <td th:text="${person.name}"></td>-->
          <!--                            <td th:text="${person.sex}"></td>-->
          <!--                            <td th:text="${person.age}"></td>-->
          <!--                        </tr>-->

          <tr>
            <td colspan="5">
              <div style="margin: auto; width: 160px;">

                <a id="prePage" href="http://localhost:8080/borrow1">
                  <button class="layui-btn layui-btn-sm">上一页</button>
                </a>
                <label id="lab1" ></label>

                <span>/</span>

                <label id="lab2" ></label>

                <a id="nextPage" href=#>
                  <button class="layui-btn layui-btn-sm">下一页</button>
                </a>
              </div>
            </td>
          </tr>
        </table>

        <!--                <p>当前 <span th:text="${pageInfo.pageNum}"></span> 页,总 <span th:text="${pageInfo.pages}"></span> 页,共 <span th:text="${pageInfo.total}"></span> 条记录</p>-->
        <!--                <a th:href="@{/getAllPerson}">首页</a>-->
        <!--                <a th:href="@{/getAllPerson(pageNum=${pageInfo.hasPreviousPage}?${pageInfo.prePage}:1)}">上一页</a>-->
        <!--                <a th:href="@{/getAllPerson(pageNum=${pageInfo.hasNextPage}?${pageInfo.nextPage}:${pageInfo.pages})}">下一页</a>-->
        <!--                <a th:href="@{/getAllPerson(pageNum=${pageInfo.pages})}">尾页</a>-->

      </div>
    </main>
  </div>
</div>


<script th:src="@{/assets/dist/js/bootstrap.bundle.min.js}"></script>

<script src="https://cdn.jsdelivr.net/npm/feather-icons@4.28.0/dist/feather.min.js" integrity="sha384-uO3SXW5IuS1ZpFPKugNNWqTZRRglnUJK6UAZ/gxOX80nxEkN9NcGZTftn6RzhGWE" crossorigin="anonymous"></script><script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js" integrity="sha384-zNy6FEbO50N+Cg5wap8IKA4M/ZnLJgzc6w2NqACZaK0u0FXfOWRRJOnQtpZun8ha" crossorigin="anonymous">

</script><script th:src="@{/js/dashboard.js}"></script>
</body>
</html>